<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <figure>
        <a target="_blank" href="https://baike.baidu.com/item/%E5%A4%AA%E9%98%B3%E7%B3%BB/173281?fr=ge_ala">
            <img usemap="#solarMap" src="img/solar.webp" alt="">
        </a>
        <figcaption>
            <h2>太阳系</h2>
        </figcaption>
        <p>
            以太阳为中心并受其引力使周边天体维持一定规律运转所形成的天体系统
        </p>
    </figure>

    <map name="solarMap">
        <area shape="circle" coords="362,209,50" href="https://baike.baidu.com/item/%E6%9C%A8%E6%98%9F/222105" alt="木星" target="_blank">
        <area shape="rect" coords="472,276,528,315" href="https://baike.baidu.com/item/%E5%9C%9F%E6%98%9F/136354?fr=ge_ala" alt="土星" target="_blank">
        <area shape="poly" coords="278,314,321,342,291,380,248,365" href="https://baike.baidu.com/item/%E8%B0%B7%E7%A5%9E%E6%98%9F/2746376?fr=ge_ala" alt="谷神星" target="_blank">
    </map>
</body>
</html>